<template>
	<section id="coupon">
		<van-search id="searchIpt" v-model="supValue" placeholder="商品ID,淘口令,链接,2合1,天猫链等转淘口令" show-action @search="onWYSearch">
			<div class="searchBtn" slot="action" @click="onWYSearch">搜索</div>
		</van-search>
		<!-- banner -->
		<van-swipe v-if="commodity.small_images" :autoplay="3000" indicator-color="white">
		  <van-swipe-item v-for="(image, index) in commodity.small_images" :key="index">
			<img :src="image" @click="downImg(image)"/>
		  </van-swipe-item>
		</van-swipe>
		<van-cell-group>
			<van-cell v-if="commodity.title" :title="commodity.title" />
			<van-cell title="淘口令" :value="commodity.tbk_pwd" label="点击复制,打开淘宝APP即可购买" @click="tklFunc()"/>
			<van-cell v-if="commodity.zk_final_price" title="在售价" :value="commodity.zk_final_price" />
			<van-cell v-if="commodity.coupon_info" title="¥内部优惠券¥" :value="commodity.coupon_info" />
			<van-cell v-if="commodity.title" title="组合口令" value="点击复制，领优惠" label="可分享给好友也可自行购买" @click="tbkpwdFunc()"/>
			<van-cell v-if="commodity.coupon_short_url" title="立即购买(短链接)" value=">"  @click="dljFunc()"/>
			<div class="copyText" v-show="noCopyText">
				<h2>
					复制失败，请手动复制以下内容：
				</h2>
				<p>
					{{noCopyText}}
				</p>
			</div>
			<van-cell v-if="commodity.commission_rate" v-show="islogin" title="火力值" :value="commodity.commission_rate*100" />
			<van-cell v-if="commodity.user_type == '1'" title="天猫店铺" :value="commodity.nick" />
			<van-cell v-if="commodity.user_type == '0'" title="淘宝店铺" :value="commodity.nick" />
			<van-cell v-if="commodity.volume" title="月销" :value="commodity.volume" />
			<van-cell v-if="commodity.reserve_price" title="定价" :value="commodity.reserve_price" />
			
			<van-cell v-if="commodity.coupon_click_url" title="立即购买(长链接)" value=">"  @click="cljFunc()"/>
			<van-cell v-if="commodity.cat_name" title="类目" :value="commodity.cat_name" :label="commodity.cat_leaf_name" />
			
			<!-- <van-cell title="商品链接（无券直接去淘宝）" is-link :url="commodity.item_url" /> -->
		</van-cell-group>
		

	</section>
</template>

<script>
import storages from "@/utils/storage.js";

	export default {
		data() {
			return {
				supValue: '',
				noCopyText: '',
				commodity: {},
			};
		},
		components: {

		},
		methods: {
			downImg(imgsrc, name) {
				let alink = document.createElement("a");
				let ntm = new Date().getTime();
				alink.href = imgsrc;
				alink.download = ntm; //图片名
				alink.click();
			},
			onWYSearch() {
				let supValue = this.supValue;
				let _this = this;
				if (!supValue) {
					this.$toast('请输入正确内容');
					return false;
				}
				let aliasId = storages.getItem("recommender", {
					type: "local"
				});

				// 加载遮罩
				let loadToast = this.$toast.loading({
					mask: true,
					message: '加载中...',
					duration: '30000'
				});

				this.service.WYsuperSearch({
					para: supValue,
					aliasId: aliasId || ''
				}).then(res => {
					if (res.code == 1) {
						loadToast.clear();
						console.log(res);
						if(res.data.error == '0'){
							this.commodity = res.data.data;
						}else{
							_this.$dialog.alert({
								message: res.data.msg
							}).then(()=>{
							});
						}
						
					}
				})
			},
			tklFunc(){
				let _this = this
				if(this.commodity.tbk_pwd){
					this.$copyText(this.commodity.tbk_pwd).then(function (e) {
						_this.$toast('复制成功,请打开淘宝app');
						// _this.$dialog.alert({
						// 	message: '复制成功,正在打开淘宝！'
						// }).then(()=>{
						// 	window.open('https://www.taobao.com')
						// });
					}, function (e) {
						this.noCopyText = this.commodity.tbk_pwd;
						_this.$toast('复制失败！');
					})
				}else{
					_this.$toast('请确保有口令时复制！');
				}
			},
			tbkpwdFunc(){
				if(this.commodity.title){
					let _this = this
					let xdlj = this.commodity.title;
					xdlj += ' \n ----------------- ';
					xdlj += ' \n ' + '【在售价】' + this.commodity.zk_final_price;
					if(this.commodity.coupon_info){
						xdlj += ' \n ' + '【优惠券】 ' + this.commodity.coupon_info;
					}
					xdlj += ' \n ' + '【下单链接】 '+ this.commodity.coupon_short_url;
					xdlj += ' \n ----------------- ';
					xdlj += '\n' + '复制这条信息，  ' + this.commodity.tbk_pwd + '  ，打开【手机淘宝】即可下单';
					this.$copyText(xdlj).then(function (e) {
						_this.$toast('复制成功');
					}, function (e) {
						this.noCopyText = xdlj;
						_this.$toast('复制失败！');
					})
				}
			},
			dljFunc(){
				if(this.commodity.coupon_short_url){
					window.open(this.commodity.coupon_short_url)
				}
			},
			cljFunc(){
				if(this.commodity.coupon_click_url){
					window.open(this.commodity.coupon_click_url)
				}
			},
		},
		mounted() {
			let num_iid = this.$route.query.num_iids
			if(num_iid){
				this.supValue = num_iid;
				this.onWYSearch()
			}else{
				this.supValue = this.$store.state.publicMoudle.WYsuperVal
			}
		},
		computed: {
			islogin: function() {
				let tokens = storages.getItem("token", {
					type: "local"
				});
				
				if(tokens&&tokens!='null'&&tokens!='undefind'){
					return true;
				}else{
					return false;
				}
			},
		},
		watch: {
			'supValue' (newVal,old){
				this.$store.dispatch('setPublicData', {name: 'setWYsuperVal',val: newVal})
			}
		},
	};
</script>
<style scoped lang="scss">
#coupon{
	padding-bottom: 120px;

	.van-search{
		background: #FF852A !important;	
	}

	.searchBtn{
		padding: 0 10px;
		font-size: 28px;
		line-height: 30px;
		color: white;
	}

	.copyText{
		margin-top: 50px;
		h2{
			text-align: center;
			font-size: 32px;
		}

		p{
			text-align: center;
			line-height: 32px;
			margin-top: 20px;
			font-size: 26px;
		}
	}
}
</style>
